<!--
 * @Author: 路漫漫
 * @Date: 2022-09-14 09:45:10
 * @项目描述: 
 * @Description: 花有重开日，人无再少年
-->
<template>
  <div>
    <el-dialog
      :title="isNew ? '新建指令' : isEdit ? '详情' : '编辑指令'"
      :visible.sync="dialogVisible"
      width="30%"
      :before-close="handleClose"
      :close-on-click-modal="false"
      center
    >
      <div style="text-align: right; margin-bottom: 10px">
        <el-button
          v-show="!isNew"
          class="el-icon-edit btn"
          :class="{ active: !isEdit }"
          @click="isEdit = !isEdit"
          >编辑</el-button
        >
      </div>
      <el-form
        ref="form"
        :model="form"
        label-width="110px"
        :disabled="isEdit"
        :rules="rules"
      >
        <div class="dialog_content">
          <el-form-item label="指令标题:" prop="title">
            <el-input v-model="form.title"></el-input>
          </el-form-item>
          <el-form-item label="指令内容:" prop="content">
            <el-input
              type="textarea"
              placeholder="请输入内容"
              v-model="form.content"
              maxlength="200"
              show-word-limit
            >
            </el-input>
          </el-form-item>
        </div>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button
          style="background-color: #1d976e; color: #fff"
          @click="handleClick"
          :disabled="isEdit"
          >保 存</el-button
        >
      </span>
    </el-dialog>
  </div>
</template>

<script>
export default {
  name: "",
  components: {},
  props: {
    isNew: {
      typeof: Boolean,
      default: true,
    },
  },
  data() {
    return {
      rules: {
        title: [{ required: true, message: "标题不能为空", trigger: "blur" }],
        content: [{ required: true, message: "内容不能为空", trigger: "blur" }],
      },
      dialogVisible: false,
      form: {},
      isEdit: false,
      fid: "",
      orgId: "",
    };
  },
  computed: {},
  watch: {},
  created() {},
  mounted() {},
  methods: {
    init(val) {
      if (val) {
        this.fid = val.fid;
        this.orgId = val.orgId;
        this.findList();
        this.isEdit = true;
      } else {
        this.isEdit = false;
      }
      this.dialogVisible = true;
    },
    findList() {
      let data = {
        fid: this.fid, //主键id
        orgId: this.orgId, //当前组织id
      };
      this.$api.work_findPageByCondition(data).then((res) => {
        if (res.code == 0) {
          this.form = res.data.rows[0];
        }
      });
    },
    handleClick() {
      this.$refs.form.validate((valid) => {
        if (valid) {
          if (this.isNew) {
            // 新增
            this.$api
              .work_createInfo({
                ...this.form,
                userId: this.$s.get("userInfo").userId, //用户id
                orgId: this.$s.get("userInfo").orgId, //当前组织id
              })
              .then((res) => {
                if (res.code == 0) {
                  this.$msg.success("添加指令成功！");
                  this.dialogVisible = false;
                  this.$emit("refresh");
                }
              });
          } else {
            // 编辑
            this.$api
              .work_updateByCondition({
                ...this.form,
                fid: this.fid, //主键id
              })
              .then((res) => {
                if (res.code == 0) {
                  this.$msg.success("修改指令成功！");
                  this.dialogVisible = false;
                  this.$emit("refresh");
                }
              });
          }
        } else {
          return false;
        }
      });
    },
    handleClose() {
      this.dialogVisible = false;
      this.form = {};
    },
  },
};
</script>

<style scoped lang='scss'>
.btn {
  border: none;
}
::v-deep .el-textarea__inner {
  background-color: #eee;
  min-height: 10rem !important;
}
::v-deep .el-textarea .el-input__count {
  background-color: #eee;
}
.active {
  background-color: #fff;
  color: red;
}
</style>

